<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
      // this 是谁：谁调用就是谁. xxx.func()
      // 看不出来谁调用，一般是 window

      // 全局的变量都相当于是添加给了 window对象
      // 鸿蒙中没有这个对象


      function sayHi() {
        console.log('sayHi:', this)
      }
      //sayHi()    //Window

//能够看出来是谁调用的  this就是谁
const person={
    name :'小李子',
skill:'jump',
film:'泰坦尼克号',
sayHi(){
    console.log('sayHi',this)
},

sayHello:()=>{
    console.log('sayHello', this)
},
Chat(){
    console.log('Chat',this)

setTimeout(()=>{
console.log('11 ',this)     // this     Window 
},2000)

}
}

//person.sayHi()     //this   person

//person.sayHello()    //this   window    因为这里使用的是箭头函数,然后箭头函数需要找到相对应的作用域,但是person={}并不是一个作用域,因此需要向上面继续寻找,就是Window

person.Chat()        //this   person

// 常见的作用域：函数作用域。块级作用域，模块作用域，全局作用域
 // 面试话术：
      /**
       * 聊到了 this，聊到了箭头函数。聊到了坑点
       * this 这个东西在JS 和 TS 中都很灵活，因为会动态的改变，但是有一些记忆的规则：
       *  谁调用就是谁，看不出来谁调用，一般是全局对象，如果实在浏览器中，这个对象是 window
       * 也有特殊情况，比如箭头函数，创建的时候 this 就绑定了，绑定的是上一级作用域中的 this，比如函数作用域，块级作用域，全局，模块。。
       * 箭头函数，在鸿蒙开发中经常需要使用，因为如果不指定 this 可能出现指向错误的问题，导致无法正常取值，buildParams 中，子通过回调函数传递数据给父组件，也需要通过箭头函数，这两个是比较常见的，我也掉过坑
       * 在 js 中早期还有一些更灵活的写法，比如 call，apply，bind，但是有了箭头函数之后一般不需要使用他们了。
       * 【下一句，看是否准备了】之前研究 this 指向的时候看过，还自己手写过
       * */

    </script>
</body>
</html>